import {
  HistoryOutlined,
  LockOutlined,
  MenuOutlined,
  TeamOutlined,
  UserOutlined,
} from '@ant-design/icons-vue'

// 常量路由
export const HOME_PATH = '/'
export const LOGIN_PATH = '/user/login'
export const WHITE_LIST = [HOME_PATH, LOGIN_PATH]
export const HAS_QUERY_PATH_LIST = ['/cases/detail']
export function userIsGoToLogin(path: string) {
  return [LOGIN_PATH].includes(path)
}
export function userIsGoToWhiteList(path: string) {
  return WHITE_LIST.includes(path)
}

/**
 * 菜单属性说明：
  path: 跳转路径
  name: 名称(菜单名称 页面标签)
  redirect: 重定向到子路由
  component: 组件地址
  hideInMenu: 是否隐藏在菜单栏
  meta: { roles, title, icon, activeMenu } 角色(菜单可访问的角色) 标题(面包屑文本) 图标 在子路由里配置高亮的父级菜单
  children: 子路由
 */

// 静态路由
export const constantRoutes = [
  {
    path: '/user',
    name: 'login',
    redirect: LOGIN_PATH,
    component: () => import('@/layouts/user-layout/index.vue'),
    hideInMenu: true,
    children: [
      {
        path: LOGIN_PATH,
        name: 'User Login',
        component: () => import('@/layouts/user-layout/login.vue'),
      },
    ],
  },
  {
    path: '/',
    // name: 'Home',
    redirect: '/home',
    component: () => import('@/layouts/app-layout/index.vue'),
    children: [
      {
        path: '/home',
        name: 'Home',
        meta: { title: 'Home Dashboard' },
        component: () => import('@/views/home/index.vue'),
      },
    ],
  },
  {
    path: '/usercenter',
    name: 'History',
    redirect: '/usercenter/history',
    component: () => import('@/layouts/app-layout/index.vue'),
    children: [
      {
        path: '/usercenter/history',
        name: 'Login History',
        meta: { title: 'Interaction history', icon: HistoryOutlined },
        component: () => import('@/views/usercenter/history.vue'),
      },
      {
        path: '/usercenter/password',
        name: 'Password',
        meta: { title: 'Password', icon: LockOutlined },
        component: () => import('@/views/usercenter/password.vue'),
      },
    ],
  },
  // {
  //   path: '/',
  //   hideInMenu: true,
  //   redirect: '/cases/index',
  //   component: () => import('@/layouts/app-layout/index.vue'),
  //   // 这里的index和detail是上下级关系，如果想在detail页面的面包屑中显示上级的标题，需要设置meta.title
  //   // 虽然是上下级关系但是是平行展示，如果进入详情页时想让父级也高亮，需要配置activeMenu为父菜单表示需要当前高亮的菜单
  //   meta: { title: 'Cases' },
  //   children: [
  //     {
  //       path: '/cases/index',
  //       name: 'Cases',
  //       meta: { title: 'Cases', icon: ContainerOutlined },
  //       component: () => import('@/views/cases/index.vue'),
  //     },
  //     {
  //       path: '/cases/detail',
  //       name: 'Cases Detail',
  //       hideInMenu: true,
  //       meta: { title: 'Cases Detail', icon: ContainerOutlined, activeMenu: '/cases/index' },
  //       component: () => import('@/views/cases/detail.vue'),
  //     },
  //   ],
  // },
  {
    path: '/403',
    name: '403',
    hideInMenu: true,
    component: () => import('@/views/auth/403.vue'),
  },
  {
    path: '/404',
    name: '404',
    hideInMenu: true,
    component: () => import('@/views/auth/404.vue'),
  },
]

// 异步路由
export const asyncRoutes = [
  {
    path: '/system',
    // name: 'System', // 如果父容器有name，那么菜单显示的时候子菜单都会被收到这个菜单下面去
    redirect: '/system/menu',
    component: () => import('@/layouts/app-layout/index.vue'),
    // hideInMenu: true,
    children: [
      {
        path: '/system/accouts',
        name: 'System Accounts',
        meta: { title: 'Accouts', icon: UserOutlined },
        component: () => import('@/views/accouts/index.vue'),
      },
      {
        path: '/system/menu',
        name: 'System Menu',
        meta: { title: 'system menu', icon: MenuOutlined },
        component: () => import('@/views/system/menu.vue'),
      },
      {
        path: '/system/role',
        name: 'System Role',
        meta: { title: 'system role', icon: TeamOutlined },
        component: () => import('@/views/system/role.vue'),
      },
      {
        path: '/system/permission',
        name: 'System Permission',
        meta: { title: 'system permission', icon: TeamOutlined },
        component: () => import('@/views/system/permission.vue'),
      },
    ],
  },
  {
    path: '/:catchAll(.*)',
    redirect: '/404',
    hideInMenu: true,
  },
]
